<template>
  <guat-page-layout title="成员管理">
    <template #actions>
      <guat-button-group
        :buttons="[
          {
            text: '筛选',
            internal: $config.$button.PLO,
            onClick: () => setDrawerVisible(true),
          },
          {
            text: '添加新成员',
            internal: $config.$button.PLR,
            permission: $permission.SYSTEM_MEMBER_ADD,
            onClick: handleClickAdd,
          },
          {
            text: '批量删除',
            internal: $config.$button.RLR,
            permission: $permission.SYSTEM_MEMBER_DEL,
            disabled: checkedRecords.length == 0,
          },
        ]"
      />
    </template>
    <guat-member-table />
    <guat-new-and-edit-modal :title>
      <guat-new-and-edit-form />
    </guat-new-and-edit-modal>
    <guat-search-drawer title="筛选">
      <guat-search-form layout="vertical" />
    </guat-search-drawer>
  </guat-page-layout>
</template>

<script lang="tsx" setup>
import { createTableColumns } from "../table-config";
import { createDrawerForm, createMemberForm } from "../form-config";

const isAdd = ref(true);
const title = computed(() => (isAdd.value ? "新增成员" : "修改成员信息"));

const [GuatMemberTable, { checkedRecords, setTableData }] = useTable(
  createTableColumns({
    handleClickEdit,
    handleClickDelete,
  })
);
const [GuatNewAndEditModal, { setModalVisible }] = useModal();
const [GuatNewAndEditForm] = useForm(createMemberForm);
const [GuatSearchDrawer, { setDrawerVisible }] = useDrawer();
const [GuatSearchForm] = useForm(createDrawerForm);

const handleClickAdd = async () => {
  setModalVisible(true);
};

function handleClickEdit(_record: any) {
  // setFormValue(record);
  isAdd.value = false;
  setModalVisible(true);
}

function handleClickDelete() {}

onMounted(() => {
  setTableData([
    {
      userAvatar: "/src/assets/avatar.png",
      userName: "admin",
      userNo: "2020070030506",
      userGender: "男",
      userRole: "管理员",
      userTel: "18812345678",
      userClass: "2020级-软件工程-5班",
      userRegisterTime: "2023-04-10 00:00:00",
      userCurPoint: 1200,
      userStatus: "正常",
    },
    {
      userName: "系统管理员",
      userNo: "2022070020506",
      userGender: "男",
      userRole: "普通用户",
      userTel: "18812345678",
      userClass: "2022级-计算机科学与技术-2班",
      userRegisterTime: "2023-04-11 00:00:00",
      userCurPoint: 336,
      userStatus: "正常",
    },
  ]);
});
</script>

<style scoped></style>
